<!DOCTYPE html>
<html xmlns:th="www.thymeleaf.org">
<meta charset="UTF-8">
<head th:replace="back/index::ph('班级作业')"></head>
<body>
	<header th:replace="back/index::header"></header>
	<main>
		<div class="content">
			<fieldset>
				<legend>
					<a href="/">首页</a> >> 班级作业
				</legend>
				<div>
					<choose label="班级" :items="clsSnItemUrl" vf="cls_sn" model="args.clsSn"></choose>
					<choose label="作业" :items="taskItemUrl" vf="id" nf="name" model="args.taskId"></choose>
					<button @click="find">查询</button>
				</div>
				<table>
					<tr><th>序号</th><th v-for="c in cols">{{c}}</th></tr>
					<tr v-for="(u,i) in data.data">
						<td>{{i+1}}</td>
						<td v-for="(value,key,index) in cols">{{val(u,key)}}</td>
					</tr>
				</table>
			</fieldset>
		</div>
	</main>
	<footer th:replace="back/index::footer"></footer>
</body>
<script type="text/javascript">
var v = new Vue({
	el : "main",
	data : {
		args : { clsSn:"", taskId:0 },
		cols : { clsSn:"班级", taskName:"作业", userName:"学员", taskInTime:"布置时间", finishAt:"计划完成时间", finish_at:"实际完成时间"},
		data : {},
		clsSnItemUrl : "hwctask/task/queryClsSnItems",
		taskItemUrl : "hwctask/task/find"
	},
	methods : {
		find(){
			axios.post("hwctask/taskLog/clstask", usp(this.args)).then(res=>{
				this.data = res.data;
			});
		},
		val(obj,field){
			try{
				return eval('obj.' + field);
			}catch(e){
				return '';
			}
		}
	},
	watch:{
		'args.clsSn' : function(newValue, oldValue){
			this.taskItemUrl = "hwctask/task/find?clsSn=" + newValue;
			this.args.taskId = 0;
		}
	}
});
</script>
</html>